<title>流程实例管理</title>
<script type="text/html" template>
    <link rel="stylesheet" href="{{ layui.setter.base }}style/template.css?v={{ layui.admin.v }}-1" media="all">
</script>
<div class="layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb">
        <a>流程管理</a>
        <a><cite>流程实例管理</cite></a>
    </div>
</div>
<script type="text/html" id="headerToolsBar">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-sm" lay-event="query">
            <i class="layui-icon">&#xe615;</i>
            <span>查询</span>
        </a>
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">
            <i class="layui-icon">&#x1006;</i>
            <span>删除</span>
        </a>
        <a class="layui-btn layui-btn-sm" lay-event="reset">
            <i class="layui-icon">&#xe9aa;</i>
            <span>重置</span>
        </a>
    </div>
    <form class="layui-form" action="" lay-filter="instanceQueryForm" style="margin-top:10px">
        <div class="table-top-filter">
            <div class="table-filter-alone">
                <label class="layui-form-label">标题</label>
                <input type="text" name="Q_name_SL" id="name" class="layui-input filter-value" placeholder="标题"/>
            </div>
            <div class="table-filter-alone">
                <label class="layui-form-label">流程定义key</label>
                <input type="text" name="Q_modelKey_SL" id="modelKey" class="layui-input filter-value" placeholder="流程定义key"/>
            </div>
            <div class="table-filter-alone">
                <label class="layui-form-label">描述</label>
                <input type="text" name="Q_description_SL" id="description" class="layui-input filter-value" placeholder="描述"/>
            </div>
        </div>
    </form>
</script>

<table  id="processInstanceTable" lay-filter="processInstanceTable"></table>

<script type="text/html" id="bar">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    <a class="layui-btn layui-btn-xs" lay-event="log">操纵日志</a>
</script>

<script>
    layui.use(['table', 'layer', 'jquery', 'form', 'util', 'common'], function () {
        var table = layui.table;
        var layer = layui.layer;
        var util = layui.util;
        var common = layui.common;
        var $ = layui.$;
        var setter = layui.setter;
        //第一个实例
        table.render({
            elem: '#processInstanceTable'
            ,cellMinWidth: 70
            , title: '流程实例列表'
            , url: serverPath.workflowPath+setter.workflowLinkPath+'processInstance/list'
            , method: 'post'
            , toolbar: '#headerToolsBar'
            , page: true
            , cols: [[
                {type: 'checkbox', fixed: 'left'}
                , { title: '标题',  sort: true, align: 'center',templet: function (d) {
                        return d.name + "-" + d.startTime;
                    }}
                , {field: 'name', title: '流程定义名称', sort: true, align: 'center'}
                , {field: 'startUserId', title: '创建人',  sort: true, align: 'center'}
                , {field: 'startTime', title: '创建时间',sort: true, align: 'center',templet:function(d){
                        if (d.startTime == undefined) {
                            return "";
                        }else {
                            return util.toDateString(d.startTime, "yyyy-MM-dd HH:mm:ss");
                        }
                }}
                , {field: 'endTime', title: '结束时间',sort: true, align: 'center',templet:function(d){
                        if (d.endTime == undefined) {
                            return "";
                        }else {
                            return util.toDateString(d.endTime, "yyyy-MM-dd HH:mm:ss");
                        }
                    }
                }
                , {field: 'durationInMillis', title: '持续时间', sort: true, align: 'center',templet:function(d){
                        if (d.durationInMillis == undefined) {
                            return "";
                        }else {
                            return (d.durationInMillis/1000) + "秒";
                        }
                    }
                }
                , {fixed: 'right', title: '管理', toolbar: '#bar', width: 150, align: 'center'}
            ]]
        });

        table.on('toolbar(processInstanceTable)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data; //获取选中行数据
            switch (obj.event){

                case 'query':
                    common.tableConditionRender("processInstanceTable","instanceQueryForm",{where:{}},false);

                    break;
                case 'del':
                    if (data.length === 0) {
                        layer.msg('请先选择一行数据！');
                    } else {
                        var seleIds = [];
                        for (var i = 0; i < data.length; i++) {
                            seleIds.push(data[i].id);
                        }
                        var s = seleIds.join(",");
                        layer.confirm('确定删除当前数据吗？', function() {
                            $.ajax({
                                url: serverPath.workflowPath + setter.workflowLinkPath + "processInstance/delete/" + s,
                                type: "DELETE",
                                success: function(data) {
                                    //执行重载
                                    table.reload('processInstanceTable', {
                                        page: {curr: 1, limit: 10}
                                    });
                                    if (filterRecord(result)) {
                                        window.parent.layer.alert(result.msg, function () {
                                            bulletWindow(window.parent.index);
                                            window.parent.layui.index.render();
                                        });
                                    } else {
                                        window.parent.layer.alert(result.msg);
                                    }

                                },
                                error: function (data) {
                                    layer.alert(data.msg);
                                }
                            })
                        })
                    }
                    break;
                case 'reset':
                    common.tableConditionRender("processInstanceTable","instanceQueryForm",{where:{}},false);
                    break;
            }
        });
        //监听行工具事件
        table.on('tool(processInstanceTable)', function (obj) {
            var data = obj.data;
            switch (obj.event) {
                case 'del':
                    layer.confirm("确认要删除该模型吗？", {title: '删除确认'}, function (index) {

                        $.ajax({
                            url: serverPath.workflowPath+setter.workflowLinkPath + "processInstance/delete/" + data.id,
                            type: 'DELETE',
                            data: {cascade: false},
                            success: function (result) {
                                table.reload('processInstanceTable', {
                                    page: {
                                        curr: 1
                                    }
                                });
                                if (filterRecord(result)) {
                                    window.parent.layer.alert(result.msg, function () {
                                        bulletWindow(window.parent.index);
                                        window.parent.layui.index.render();
                                    });
                                } else {
                                    window.parent.layer.alert(result.msg);
                                }
                            }
                        });
                    });
                    break;
            }

        });
    });
</script>
<style>

    .table-top-filter div {
        display: inline-block;
    }

    .table-top-filter .layui-form-label {
        width: 72px;
    }

    .table-top-filter div input {
        border-radius: 4px;
        float: left;
        width: 160px;
    }

    .table-top-filter label.layui-form-label {
        width: 108px;
        float: left;
    }

    .tablesize .layui-table-view {
        margin-right: 10px;
    }

    .layui-form-label {
        width: 90px;
    }

    .layui-form-item .layui-inline {
        margin-right: 0;
    }

    .layui-form-item .layui-i nput-inline {
        width: 103px;
    }

</style>